import { createApp } from 'vue';
import './style.css';
import App from './App.vue';
import router from './router';

const app = createApp(App);
app.use(router);

// 1107: 自定义指令，见views\directive\index.vue
// 1107：自定义指令-2.全局注册指令：
// 使 v-focus 在所有组件中都可用
// app.directive('focus', {
//   // mounted: (el: HTMLElement) => el.focus(),
//   mounted(el) {
//     console.log(el, 'elelel');
//   },
// });

// 1107:自定义指令-4.简化形式  因为主要使用到的钩子是 mounted 和 updated
app.directive('color', (el, binding) => {
  // 这会在 `mounted` 和 `updated` 时都调用
  el.style.color = binding.value;
});
//
app.directive('demo', (el, binding) => {
  console.log(el, 'ele');
  console.log(binding, 'binding-demo');
  // el.innerHTML = binding.value.text;
  el.textContent = binding.value.text;
  el.style.color = binding.value.color;
});

app.mount('#app');
